<template>
    <div class="example1-wrapper">
        <div style="margin-top:20px;display:inline-table">
            <span>订单号: </span>
            <bk-input :clearable="true" v-model="searchorderid" style="width:200px;"></bk-input>
            <span style="margin-left:20px">客户名: </span>
            <bk-input :clearable="true" v-model="searchcustomer" style="width:220px"></bk-input>
            <span style="margin-left:20px">完成时间: </span>
            <bk-date-picker
                class="mr15"
                v-model="searchtime"
                :placeholder="'选择日期范围'"
                :type="'daterange'"
                :up-to-now="true"
                @pick-success="picktime"></bk-date-picker>
            <bk-button style="display:inline-block" :theme="'primary'" :title="'查询'" @click="dosearch" class="mr10">查询</bk-button>
            <bk-button style="display:inline-block" :theme="'primary'" :title="'清空'" @click="myreset" class="mr10">清空</bk-button>
            <bk-button style="display:inline-block" :theme="'primary'" :title="'重置'" @click="resetsearch" class="mr10">重置</bk-button>
        </div>
        <div class="inner" style="margin-top:10px">
            <bk-table
                height="500"
                :pagination="pagination"
                @page-change="handlePageChange"
                :data="data"
                ref="table">
                <bk-table-column type="selection" width="60"></bk-table-column>
                <bk-table-column label="订单号" prop="orderid" sortable></bk-table-column>
                <bk-table-column label="客户名" prop="customername"
                    :filters="sourceFilters"
                    :filter-method="sourceFilterMethod"
                    :filter-multiple="false">
                </bk-table-column>
                <bk-table-column label="客户地址" prop="customeraddress"
                    :filters="sourceFilters"
                    :filter-method="sourceFilterMethod"
                    :filter-multiple="false">
                </bk-table-column>
                <bk-table-column label="价格(元)" prop="total"></bk-table-column>
                <bk-table-column label="状态" prop="status"></bk-table-column>
                <bk-table-column label="完成时间" prop="createtime"></bk-table-column>
                <bk-table-column label="操作" width="150">
                    <template slot-scope="props">
                        <bk-button @click="lookinfo(props.row)" class="mr10" theme="primary" text>详情</bk-button>
                    </template>
                </bk-table-column>
            </bk-table>
        </div>
    </div>
</template>

<script>
    export default {
        inject: ['reload'],
        data () {
            const user = sessionStorage.getItem('user')
            if (user) {
                const username = JSON.parse(user)
                this.username = username
            }
            this.getorders(1)
            return {
                isSearch: false,
                searchorderid: '',
                searchcustomer: '',
                searchtime: '',
                username: '',
                mername: '',
                data: [
                ],
                pagination: {
                    current: 1,
                    count: 0,
                    limit: 10
                }
            }
        },
        watch: {
            searchorderid: {
                handler () {
                    const that = this
                    that.checksearch()
                }
            },
            searchtime: {
                handler () {
                    const that = this
                    that.checksearch()
                }
            },
            searchcustomer: {
                handler () {
                    const that = this
                    that.checksearch()
                }
            }
        },
        created () {
        },
        methods: {
            /**
             * 获取页面数据
             *
             * @return {Promise} promise 对象
             */
            checksearch () {
                if (this.searchorderid === '' && this.searchcustomer === '' && this.searchtime[0] === '' && this.searchtime[1] === '') {
                    this.isSearch = false
                } else {
                    this.isSearch = true
                }
            },
            dosearch () {
                this.searchgetorder(1)
            },
            searchgetorder (page) {
                const qs = require('qs')
                this.axios({
                    url: '/searchorder/',
                    method: 'post',
                    responseType: 'json',
                    data: qs.stringify({
                        username: JSON.parse(sessionStorage.getItem('user')),
                        orderid: this.searchorderid,
                        customer: this.searchcustomer,
                        time: JSON.stringify(this.searchtime),
                        page: page
                    })
                }).then(res => {
                    if (res.data.result === true) {
                        if (res.data.result_data.length === 0) {
                            this.$bkInfo({
                                title: '未找到搜索内容'
                            })
                        } else {
                            this.data = []
                            this.pagination.count = res.data.num
                            for (const i in res.data.result_data) {
                                const tmp = {
                                    orderid: 0,
                                    customername: '',
                                    customeraddress: '',
                                    status: '',
                                    total: 0,
                                    createtime: ''
                                }
                                tmp.orderid = res.data.result_data[i].id
                                tmp.customername = res.data.result_data[i].customerrealname
                                tmp.customeraddress = res.data.result_data[i].customeraddress
                                tmp.status = res.data.result_data[i].status
                                tmp.total = res.data.result_data[i].total
                                tmp.createtime = res.data.result_data[i].updatetime
                                this.$set(this.data, i, tmp)
                            }
                        }
                    }
                })
            },
            resetsearch () {
                this.reload()
            },
            myreset () {
                this.searchorderid = ''
                this.searchcustomer = ''
                this.searchtime = ''
                this.isSearch = false
            },
            handlePageChange (page) {
                this.pagination.current = page
                if (this.isSearch) {
                    this.searchgetorder(page)
                } else {
                    this.getorders(page)
                }
            },
            getorders (page) {
                const qs = require('qs')
                this.axios({
                    url: '/getallorders_merchant/',
                    method: 'post',
                    responseType: 'json',
                    data: qs.stringify({
                        username: JSON.parse(sessionStorage.getItem('user')),
                        page: page
                    })
                }).then(res => {
                    this.pagination.count = res.data.num
                    this.data = []
                    for (const i in res.data.result_data) {
                        const tmp = {
                            orderid: 0,
                            customername: '',
                            customeraddress: '',
                            status: '',
                            total: 0,
                            createtime: ''
                        }
                        tmp.orderid = res.data.result_data[i].id
                        tmp.customername = res.data.result_data[i].customerrealname
                        tmp.customeraddress = res.data.result_data[i].customeraddress
                        tmp.status = res.data.result_data[i].status
                        tmp.total = res.data.result_data[i].total
                        tmp.createtime = res.data.result_data[i].updatetime
                        this.$set(this.data, i, tmp)
                    }
                })
            },
            lookinfo (row) {
                this.$router.push({
                    name: 'meorderinfo',
                    query: {
                        id: row.orderid
                    }
                })
            }
        }
    }
</script>

<style scoped>
    .bk-table-header .custom-header-cell {
        color: inherit;
        text-decoration: underline;
        text-decoration-style: dashed;
        text-underline-position: under;
    }
</style>
